<template>
	<form class="margin-top app-form">
		<view class="cu-form-group">
			<view class="title">是否在职</view>
			<input disabled="true" :value="model.IsPayroll ? '是' : '否'" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">工号</view>
			<input disabled="true" v-model="model.OpenId" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">姓名</view>
			<input disabled="true" v-model="model.RealName" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">手机号</view>
			<input disabled="true" v-model="model.Phone" placeholder="" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">性别</view>
			<input disabled="true" v-model="model.Gender" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">部门</view>
			<input disabled="true" v-model="model.DepartName" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">证件类型</view>
			<input disabled="true" v-model="model.CodeType" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">证件号</view>
			<input disabled="true" v-model="model.Code" name="input" class="text-right" />
		</view>
		<view class="cu-form-group" v-if="!model.IsPayroll">
			<view class="title">开户行</view>
			<input disabled="true" v-model="model.BankName" name="input" class="text-right" />
		</view>
		<view class="cu-form-group" v-if="!model.IsPayroll">
			<view class="title">银行卡号</view>
			<input disabled="true" v-model="model.CardNumber" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">监考校区</view>
			<input disabled="true" :value="app.toText('校区', model.CampusCode)" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">监考科目</view>
			<input disabled="true" :value="level" name="input" class="text-right" />
		</view>
		<view class="cu-form-group" v-if="model.CampusCode === '352012'">
			<view class="title">乘车地点</view>
			<input disabled="true" :value="model.BoardLocation" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">去年是否监考</view>
			<input disabled="true" :value="model.ParticipatedLastYear ? '是' : '否'" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">预选考场</view>
			<input disabled="true" :value="model.Preselection ? model.Preselection : '无'" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">接受校区调剂</view>
			<input disabled="true" :value="model.AcceptAdjustment ? '是' : '否'" name="input" class="text-right" />
		</view>
		<view class="cu-form-group">
			<view class="title">备注</view>
			<input disabled="true" :value="model.value" />
		</view>
		<button class="margin bg-blue lg" @click="onSubmit">返回</button>
		<view class="fixed">fixed</view>
	</form>
</template>

<script setup>
	import app from '@/app'
	import { ref, reactive, inject, h, watch } from 'vue'
	
	// -- 业务逻辑，点击确定后应该如何 -- //
	const exam = inject("exam");
	const application = inject("application");
	const emits = defineEmits(['onSubmit']);
	
	// STEP1: 填一个空模型
	const emptyModel = {
	    ID: app.GUID_EMPTY,
	    ExamId: exam.ID,
	    RealName: "",
	    Phone: "",
	    Gender: "男",
	    CodeType: "身份证",
	    Code: "",
	    BankName: "",
	    CardNumber: "",
	    ConfirmCardNumber: "",
	    CampusCode: "352011",
	    BoardLocation: "自行前往",
	    Level: "",
	    DepartId: app.GUID_EMPTY,
	    ParticipatedLastYear: false,
	    AttendTraining: false,
	    Preselection: "",
	    Status: 0,
	    Cet4Room: "",
	    Cet6Room: "",
	    Money: 0,
	    Memo: "",
	    Status: 0,
	    BuildingId: app.GUID_EMPTY,
	    Name: "",
	    OpenId: "",
	    IsPayroll: false,
	};
	const model = reactive({ ...emptyModel });
	
	const level = ref("全部");
	
	watch(application, _ => {
	    Object.assign(model, application);
	    switch (model.Level) {
	        case "A":
	            level.value = "全部";
	            break;
	        case "4":
	            level.value = "四级（上午）";
	            break;
	        case "6":
	            level.value = "六级（下午）";
	            break;
	        default:
	            level.value = "";
	            break;
	    }
	}, { immediate: true, deep: true });
	
	async function onSubmit() {
	    try {
	        emits('onSubmit');
	    } catch (err) {
	
	    }
	}
</script>

<style lang="less">
	.app-form {
		.title {
			width: 7em;
			text-align: left;
			position: relative;

			&.required::after {
				content: '*';
				color: red;
				position: absolute;
				right: 10rpx;
			}
		}

		.fixed {
			font-size: 0;
		}
	}
</style>